<template>
	<view>
		<view class="test-box">
			<view>
				 <map style="width: 100%; height: 300px;" 
					 :latitude="latitude" 
					 :longitude="longitude" 
					 :markers="covers" 
					 @markertap="markertap"
					 @tab="tab">
				 </map>
			</view>
			<view>当前位置所在城市信息:{{addres}}</view>
			<button type="primary" size="mini" @click="getLocalPosition">获取当前位置并在地图显示</button>
		</view>
		<view class="test-box">
			<view>设备信息:{{devInfo}}</view>
			<button type="default" size="mini" @click="getSystem">获取设备信息</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				addres:'',
				devInfo:'',
				latitude: 39.909,
				longitude: 116.39742,
				covers: [{
					latitude: 39.909,
					longitude: 116.39742,
					iconPath: '../../static/logo.png'
				}]
			}
		},
		methods: {
			getLocalPosition(){
				let pos = this;
				uni.getLocation({
				    type: 'gcj02',
					geocode:true,
				    success: function (res) {
				        console.log('当前位置的经度：' + res.longitude);
				        console.log('当前位置的纬度：' + res.latitude);
						console.log(res);
						pos.latitude = res.latitude;
						pos.longitude = res.longitude;
						pos.covers[0].latitude = res.latitude
						pos.covers[0].longitude = res.longitude
						pos.covers[0].iconPath = '../../static/logo.png';
						pos.addres = res.address
						uni.showModal({
						    title: '提示',
						    content: '当前经度'+res.longitude+'当前维度'+res.latitude,
						    success: function (res) {
						        if (res.confirm) {
						            console.log('用户点击确定');
						        } else if (res.cancel) {
						            console.log('用户点击取消');
						        }
						    }
						});
				    }
				});
			},
			getSystem(){
				let that = this;
				uni.getSystemInfo({
					success:function(res){
						console.log(res);
						that.devInfo = res;
					}
				})
			}
		}
	}
</script>

<style>
	.test-box{
		text-align: center;
		margin: 5px;
		padding: 5px;
	}
</style>
